<template>
    <div>
        房间列表
        	<div class="roomlist">
			<ul>
				<li
					class="room"
					v-for="(room, index) in rooms"
					:key="index"
					@click="enter(index)"
				>
					<div class="title">房名:{{ room.roomName }}</div>
					<div class="master">房主:{{ room.roomMaster }}</div>
					<div class="into">点击进入房间</div>
				</li>
			</ul>
		</div>
    </div>
</template>
<script>

export default {
    data(){
        return{
            rooms:[]
        }
    },
    mounted(){
        	//查询所有房间列表
		this.$axios({
			method: "post",
			url: "/users/commonRooms",
		})
			.then((res) => {
				this.rooms = res.data.data;
				console.log(this.rooms);
			})
			.catch((err) => {
				console.log(err);
			});


		let rooms = new Promise((resolve, reject) => {
			resolve();
		});
		rooms.then(() => {
			this.rooms = Vue.rooms;
		});
    }
}
</script>
<style lang="less">
    .info {
	display: flex;
	justify-content: space-around;
	.number {
		line-height: 40px;
		color: green;
	}
	.create {
		width: 80px;
		height: 40px;
		line-height: 40px;
		background: #0d8680;
		color: #fff;
	}
}
.roomlist {
	.room {
		height: 80px;
		border-radius: 33px;
		background: #d8d8d8;
		color: #fff;
		border: 1px solid pink;
		margin: 20px 10px;
	}
}
</style>